<template>
  <div>
    <h2>配送员列表</h2>
    <div style="margin-top:15px;border-bottom: 1px solid #e1e1e1;width:100%"></div>
    <div class="search-bar">
      <Input
        v-for="(item,index) in searchList"
        :key="index"
        v-model="item.value"
        :placeholder="item.label"
        class="il in"
      />
      <Button class="il" @click="clear()">清空</Button>
      <Button class="il" type="primary" @click="search()" style="width:100px">搜索</Button>
    </div>

    <el-table :data="data" style="width: 100%;margin-top:15px">
      <el-table-column prop="id" label="ID"></el-table-column>
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="phone" label="电话"></el-table-column>
      <el-table-column prop="classNo" label="学号"></el-table-column>
      <el-table-column prop="rate" label="抽成"></el-table-column>
      <el-table-column label="跑腿模式">
        <template slot-scope="scope">
          <el-tag
            :type="scope.row.runFlag == 1 ? 'success' : 'danger'"
            disable-transitions
          >{{scope.row.runFlag == 1 ? '开启' : '关闭'}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column
        :filters="[{text:'待审核',value:0},{text:'审核成功',value:1},{text:'审核失败',value:2}]"
        :filter-method="filterStatus"
        label="审核状态"
        width="120"
      >
        <template slot-scope="scope">
          <el-tag
            :type="scope.row.exam == '审核通过' ? 'success' : 'danger'"
            disable-transitions
          >{{scope.row.exam}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-dropdown trigger="click">
            <el-button class="el-dropdown-link" type="text">
              操作
              <i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item>
                <div style="width:100px" @click="update(0,scope.row.id)">删除</div>
              </el-dropdown-item>
              <el-dropdown-item>
                <div style="width:100px" @click="update(1,scope.row.id)">编辑</div>
              </el-dropdown-item>
              <el-dropdown-item>
                <div style="width:100px" @click="tongji(scope.row.id)">业绩统计</div>
              </el-dropdown-item>
              <el-dropdown-item>
                <div style="width:100px" @click="tongji2(scope.row.id)">提现统计</div>
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>
    <div class="flexr-end" style="margin-top:20px">
      <Page
        :total="total"
        :current="getDataListquery.page"
        :page-size="getDataListquery.size"
        show-sizer
        show-total
        @on-change="changePage"
        @on-page-size-change="changeSize"
      />
    </div>
    <el-dialog title="业绩统计" :visible.sync="newDialog2" width="50%" center>
      <div class="flexr-between item-center border-bottom">
        <div class="block">
          <span class="demonstration">设置开始时间</span>
          <el-date-picker
            v-model="firsttime"
            type="datetime"
            placeholder="选择日期时间"
            default-time="00:00:01">
          </el-date-picker>
        </div>
        <div class="block">
          <span class="demonstration">设置结束时间</span>
          <el-date-picker
            v-model="lasttime"
            type="datetime"
            placeholder="选择日期时间"
            default-time="23:59:59">
          </el-date-picker>
        </div>
        <el-button type="primary" @click="fidexiangxishuju()">查询</el-button>
      </div>
      <el-table
        :data="xiangxishuju"
        style="width: 100%;margin-top:10px"
        class="flexr-bentwee item-center margin-top-ershi"
      >
        <el-table-column prop="orderNumber" label="订单数(总)"></el-table-column>
        <el-table-column prop="orderRunNumber" label="跑腿订单数"></el-table-column>
        <el-table-column prop="complete" label="已完成(总)"></el-table-column>
        <el-table-column prop="noComplete" label="未完成(总)"></el-table-column>
        <el-table-column prop="sendPrice" label="配送费(总)"></el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog title="提现统计" :visible.sync="newDialog3" width="50%" center>
      <el-table
        height="250"
        :data="txshuju"
        style="width: 100%;margin-top:10px"
        class="flexr-bentwee item-center margin-top-ershi"
      >
        <el-table-column prop="createTime" label="时间"></el-table-column>
        <el-table-column prop="amount" label="金额"></el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog title="编辑" :visible.sync="newDialog" width="50%" center>
      <Form :model="submitData" label-postion="top">
        <FormItem label="分配楼栋">
          <div style="border-bottom: 1px solid #e9e9e9;padding-bottom:6px;margin-bottom:6px;">
            <Checkbox
              :indeterminate="indeterminate1"
              :value="checkAll1"
              @click.prevent.native="handleCheckAll1"
            >全选</Checkbox>
          </div>
          <CheckboxGroup v-model="floorsTkout" @on-change="checkAllGroupChange1">
            <Checkbox :label="item.id" v-for="item in floors" :key="item.id">{{item.name}}</Checkbox>
          </CheckboxGroup>
        </FormItem>
        <!-- <FormItem label="电话">
          <Input v-model="submitData.phone" placeholder="请输入电话"></Input>
        </FormItem> -->
        <FormItem label="对他/她抽成">
          <Input v-model="submitData.rate" placeholder="请输入抽成（最低0.006）"></Input>
        </FormItem>
        <div class="flexr-start item-center">
          <FormItem label="是否接单跑腿" class="margin-left-ershi">
            <el-switch v-model="submitData.runFlag"></el-switch>
          </FormItem>
        </div>
        <FormItem label="审核状态">
          <Select v-model="submitData.exam">
            <Option value="审核通过">审核通过</Option>
          </Select>
        </FormItem>
      </Form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="newDialog = false">取 消</el-button>
        <el-button type="primary" @click="add()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<style>
@import url("../../assets/css/component.css");
</style>
<script>
var that;
export default {
  data() {
    return {
      firsttime: '',
      lasttime: '',
      data: [],
      total: 0,
      searchList: [
        { key: "name", value: "", label: "输入配送员姓名" },
        { key: "phone", value: "", label: "输入配送员电话" }
      ],
      getDataListquery: {
        page: 1,
        size: 10,
        exam: "审核失败"
      },
      submitData: {
        id: "",
        floorIds: "",
        shopIds: "",
        // phone: "",
        rate: "",
        takeoutFlag: false,
        runFlag: false,
        exam: "审核通过"
      },
      txshuju: [{
        createTime: 0,
        amount: 0,
      }],
      xiangxishuju: [{
        orderNumber: 0,
        orderRunNumber: 0,
        complete: 0,
        noComplete: 0,
        sendPrice: 0
      }],
      floors: [],
      floorsTkout: [],
      indeterminate1: false,
      checkAll1: false,
      indeterminate2: false,
      checkAll2: false,
      newDialog: false,
      newDialog2: false,
      newDialog3: false,
      senderId: ''
    };
  },
  mounted() {
    that = this;
    this.getDataList();
  },
  methods: {
    //查询配送员
    getDataList() {
      this.$http
        .post(this.com.NODE_API + "/ops/sender/find", this.getDataListquery, {
          headers: { token: sessionStorage.getItem("token") },
          emulateJSON: true
        })
        .then(res => {
          if (res.data.code) {
            that.data = res.data.params.list;
            that.total = res.data.params.total;
          } else {
            that.$message({
              showClose: true,
              type: "error",
              message: res.data.msg
            });
          }
        });
    },
    //搜索
    search() {
      if (this.searchList[0].value != "" && this.searchList[1].value != "") {
        this.getDataListquery = {
          page: 1,
          size: 10,
          exam: "审核失败",
          name: this.searchList[0].value,
          phone: this.searchList[1].value
        };
      } else if (
        this.searchList[0].value != "" &&
        this.searchList[1].value == ""
      ) {
        this.getDataListquery = {
          page: 1,
          size: 10,
          exam: "审核失败",
          name: this.searchList[0].value
        };
      } else if (
        this.searchList[0].value == "" &&
        this.searchList[1].value != ""
      ) {
        this.getDataListquery = {
          page: 1,
          size: 10,
          exam: "审核失败",
          phone: this.searchList[1].value
        };
      }
      this.$http
        .post(this.com.NODE_API + "/ops/sender/find", this.getDataListquery, {
          headers: { token: sessionStorage.getItem("token") },
          emulateJSON: true
        })
        .then(res => {
          if (res.data.code) {
            that.data = res.data.params.list;
            that.total = res.data.params.total;
          } else {
            that.$message({
              showClose: true,
              type: "error",
              message: res.data.msg
            });
          }
        });
    },
    //清除搜索内容
    clear() {
      this.getDataListquery = {
        page: 1,
        size: 10,
        exam: "审核失败"
      };
      for (var i in this.searchList) {
        this.searchList[i].value = "";
      }
      this.getDataList();
    },
    update(e, id) {
      if (e == 0) {
        this.$confirm(
          "此操作将永久删除该数据, 是否继续? 若误删请联系开发人员",
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }
        ).then(() => {
          this.$http
            .post(
              this.com.NODE_API + "/ops/sender/update",
              { id: id, exam: "审核失败" },
              {
                headers: { token: sessionStorage.getItem("token") },
                emulateJSON: true
              }
            )
            .then(res => {
              if (res.data.code) {
                                that.$message({
                  showClose: true,
                  type: "success",
                  message: '删除成功'
                });
                this.getDataList();
              } else {
                that.$message({
                  showClose: true,
                  type: "error",
                  message: res.data.msg
                });
              }
            });
        });
      } else if (e == 1) {
        for (var i = 0; i < this.data.length; i++) {
          if (this.data[i].id == id) {
            this.submitData.id = this.data[i].id;
            this.floorsTkout =
              this.data[i].floorIds == ""
                ? []
                : this.data[i].floorIds.split(",");
            this.shopsTkout =
              this.data[i].shopIds == "" ? [] : this.data[i].shopIds.split(",");
            this.submitData.phone = this.data[i].phone;
            this.submitData.rate = this.data[i].rate;
            this.submitData.runFlag = this.data[i].runFlag == 1 ? true : false;
            this.submitData.takeoutFlag = this.data[i].takeoutFlag == 1 ? true : false;
            this.floorsTkout = this.floorsTkout.map(function(
              item,
              index,
              array
            ) {
              return item - 0;
            });
            this.shopsTkout = this.shopsTkout.map(function(item, index, array) {
              return item - 0;
            });
            this.$http
              .post(
                this.com.NODE_API + "/ops/floor/find",
                { page: 1, size: 1000 ,schoolId: sessionStorage.getItem("schoolId")},
                {
                  headers: { token: sessionStorage.getItem("token") },
                  emulateJSON: true
                }
              )
              .then(res => {
                if (res.data.code) {
                  that.floors = res.data.params.list;
                  if (that.floorsTkout.length === res.data.params.list.length) {
                    that.indeterminate1 = false;
                    that.checkAll1 = true;
                  } else if (that.floorsTkout.length > 0) {
                    that.indeterminate1 = true;
                    that.checkAll1 = false;
                  } else {
                    that.indeterminate1 = false;
                    that.checkAll1 = false;
                  }
                } else {
                  that.$message({
                    showClose: true,
                    type: "error",
                    message: res.data.msg
                  });
                }
              });
          }
        }

        this.newDialog = true;
      }
    },

    add: function() {
      this.submitData.runFlag = this.submitData.runFlag == true ? "1" : "0";
      this.submitData.floorIds = this.floorsTkout.toString();
      this.submitData.shopIds = this.shopsTkout.toString();
      this.$http
        .post(this.com.NODE_API + "/ops/sender/update", this.submitData, {
          headers: { token: sessionStorage.getItem("token") },
          emulateJSON: true
        })
        .then(res => {
          if (res.data.code) {
            that.$message({
              showClose: true,
              type: "success",
              message: '编辑完成'
            });
            this.newDialog = false;
            this.getDataList();
          } else {
            that.$message({
              showClose: true,
              type: "error",
              message: res.data.msg
            });
          }
        });
    },

    tongji (id) {
      this.firsttime = '';
      this.lasttime = '';
      this.xiangxishuju = [{
        orderNumber: 0,
        orderRunNumber: 0,
        complete: 0,
        noComplete: 0,
        sendPrice: 0
      }],
      this.newDialog2 = true;
      this.senderId = id
    },

    tongji2 (id) {
      this.$http
        .get(this.com.NODE_API + '/ops/txlog/sender/find',{
          params:{page:1,size:99,id:id},
          headers: { token: sessionStorage.getItem("token") },
          emulateJSON: true
        })
        .then(res => {
          if (res.data.code) {
            for (var i in res.data.params.list) {
              res.data.params.list[i].createTime = res.data.params.list[i].createTime.substr(0, 10)
            }
            this.txshuju= res.data.params.list
          } else {
            that.$message({
              showClose: true,
              type: "error",
              message: res.data.msg
            });
          }
        });
      this.newDialog3 = true;
      this.senderId = id
    },

    fidexiangxishuju () {
      let date = new Date(this.firsttime);  
      var y = date.getFullYear();
      var m = date.getMonth() + 1;
      m = m < 10 ? ('0'+ m) : m;
      var d = date.getDate();
      d = d < 10 ? ('0'+ d) : d;
      var h = date.getHours();
      h = h < 10 ? ('0'+ h) : h;
      var minute = date.getMinutes();
      minute = minute < 10 ? ('0'+ minute) : minute;
      var second = date.getSeconds();
      second = second < 10 ? ('0'+ second) : second;
      let date_value = y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;  
      let date2 = new Date(this.lasttime); 
      var y2 = date2.getFullYear();
      var m2 = date2.getMonth() + 1;
      m2 = m2 < 10 ? ('0'+ m2) : m2;
      var d2 = date2.getDate();
      d2 = d2 < 10 ? ('0'+ d2) : d2;
      var h2 = date2.getHours();
      h2 = h2 < 10 ? ('0'+ h2) : h2;
      var minute2 = date2.getMinutes();
      minute2 = minute2 < 10 ? ('0'+ minute2) : minute2;
      var second2 = date2.getSeconds();
      second2 = second2 < 10 ? ('0'+ second2) : second2; 
      let date_value2= y2 + '-' + m2 + '-' + d2 + ' ' + h2 + ':' + minute2 + ':' + second2; 
      this.$http
        .post(this.com.NODE_API + "/ops/sender/nocheck/senderstatistics", {senderId: this.senderId,beginTime:date_value,endTime:date_value2}, {
          headers: { token: sessionStorage.getItem("token") },
          emulateJSON: true
        })
        .then(res => {
          if (res.data.code) {
            res.data.params.result.runTotal = res.data.params.result.runSuccess + res.data.params.result.runNosuccess;
            res.data.params.result.runSuccess = res.data.params.result.runSuccess == null ? 0 : res.data.params.result.runSuccess;
            res.data.params.result.runNosuccess = res.data.params.result.runNosuccess == null ? 0 : res.data.params.result.runNosuccess;
            res.data.params.result.totalPrice = res.data.params.result.run_price + res.data.params.result.takeout_Price;
            this.xiangxishuju[0].orderNumber= res.data.params.result.takeoutTotal + res.data.params.result.runTotal;
            this.xiangxishuju[0].orderRunNumber= res.data.params.result.runTotal;
            this.xiangxishuju[0].complete= res.data.params.result.runSuccess + res.data.params.result.takeoutSuccess;
            this.xiangxishuju[0].noComplete= res.data.params.result.runNosuccess + res.data.params.result.takeoutNosuccess;
            this.xiangxishuju[0].sendPrice= res.data.params.result.totalPrice;
          } else {
            that.$message({
              showClose: true,
              type: "error",
              message: res.data.msg
            });
          }
        });
    },

    handleCheckAll1() {
      if (this.indeterminate1) {
        this.checkAll1 = false;
      } else {
        this.checkAll1 = !this.checkAll1;
      }
      this.indeterminate1 = false;

      if (this.checkAll1) {
        for (var i = 0; i < this.floors.length; i++) {
          this.floorsTkout.push(this.floors[i].id);
        }
      } else {
        this.floorsTkout = [];
      }
    },
    checkAllGroupChange1(data) {
      if (data.length === this.floors.length) {
        this.indeterminate1 = false;
        this.checkAll1 = true;
      } else if (data.length > 0) {
        this.indeterminate1 = true;
        this.checkAll1 = false;
      } else {
        this.indeterminate1 = false;
        this.checkAll1 = false;
      }
    },

    changePage(e) {
      this.getDataListquery.page = e;
      this.getDataList();
    },
    changeSize(e) {
      this.getDataListquery.size = e;
      this.getDataList();
    },
    filterStatus(value, row) {
      return row.is_show == value;
    }
  }
};
</script>
